<template>
	<view class="pages inspection-history">
		<!-- 头部header -->
		<view class="header">
			<uni-nav-bar :statusBar="true" leftIcon="arrowleft" fixed="true" title="历史巡查记录" @clickLeft="clickLeft"></uni-nav-bar>
		</view>
		<view class="p-content history-inspection-list">
			<!-- view class="ul-list-wrap" v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance="10"
			 infinite-scroll-immediate-check="true"> -->
			<view class="ul-list-wrap">
				<view class="li-item-wrap" v-for="item in inspectionList" :key="item.inspectMenuId" @click="toDetails(item)">
					<view class="li-item-wrap-view">
						<view class="time-wrap">{{item.inspectMenuDate}}</view>
						<view class="inspection-total-wrap">
							<text class="already-wrap">{{item.alreadyNum}}</text>
							<text class="total-wrap">{{item.totalNum}}</text>
						</view>
					</view>
				</view>
			</view>
			<!--分页加载样式-->
			<view class="loading-wrap">
				<text class="showLoadingTag" v-show="showLoadingTag">
					<!-- <mt-spinner type="fading-circle"></mt-spinner> -->
					<text>加载中...</text>
				</text>
				<text class="loadedFail" v-show="loadedFail">
					加载数据失败
				</text>
				<text class="noMoreDataTag" v-show="noMoreDataTag">
					<text>没有更多数据了</text>
				</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				contractorId: '',
				orgId: '',
				departmentId: '00',
				headTitle: '历史巡查记录',
				inspectionList: [],
				page: 1,
				pageSize: 15,
				totalPage: 0,
				loadedFail: false, // 是加载失败
				noMoreDataTag: false, // 没有更多数据了
				showLoadingTag: false, // 加载中
				loading: false // 是否全部加载
			}
		},
		onLoad() {
			uni.getStorage({
				key: 'contractorId',
				success: (e) => {
					this.contractorId = e.data
				}
			});
			uni.getStorage({
				key: 'orgId',
				success: (e) => {
					this.orgId = e.data
				}
			});
			uni.getStorage({
				key: 'departmentId',
				success: (e) => {
					this.departmentId = e.data
				}
			})
			this.initPage();
		},
		methods: {
			initPage() {
				this.getInspectMenuList(this.departmentId, this.contractorId, this.page, this.pageSize)
			},
			/**
			 * @description: 获取列表数据
			 * @author: LinW (evan_origin@163.com)
			 * @createDate: 2019-11-16 11:36
			 * @param: departmentId 食堂编号
			 * @param: page 当前页
			 * @param: pageSize 一页几条
			 */
			getInspectMenuList(departmentId, orgId, page, pageSize) {
				let params = {
					departmentId,
					orgId,
					page,
					pageSize
				}
				this.$request.ygstInspectMenuListGet(params).then(res => {
					// Indicator.close()
					if (this.$utils.isEmptyObject(res)) {
						this.loading = true
						return
					}
					this.showLoadingTag = false
					this.totalPage = res.totalPage
					this.inspectionList = this.inspectionList.concat(res.list)
				}).catch(e => {
					// Indicator.close()
					this.loadedFail = true
					this.showLoadingTag = false
				})
			},
			/**
			 * @description: 返回上一页
			 * @author: LinW (xuebingchuan_20@163.com)
			 * @createDate: 2020-10-10 10:40
			 */
			clickLeft() {
				uni.navigateBack()
			},
			/**
			 * @description: 加载更多
			 * @author: LinW (evan_origin@163.com)
			 * @createDate: 2019-11-16 11:15
			 * @param: mod
			 * @return:
			 */
			loadMore() {
				this.loading = true
				if (this.$route.name !== 'inspectionHistory') {
					return
				}
				if (this.page < this.totalPage) {
					this.showLoadingTag = true
					setTimeout(() => {
						this.getInspectMenuList(this.departmentId, this.contractorId, ++this.page, this.pageSize)
						this.loading = false
					}, 600)
				} else {
					this.noMoreDataTag = true
					this.loading = true
				}
			},
			/**
			 * @description: 跳转详情页
			 * @author: LinW (evan_origin@163.com)
			 * @createDate: 2019-11-16 11:37
			 * @param: mod
			 * @return:
			 */
			toDetails(item) {
				// this.$router.push({
				// 	path: 'inspectionHistoryList',
				// 	query: {
				// 		inspectMenuDate: item.inspectMenuDate,
				// 		inspectMenuId: item.inspectMenuId
				// 	}
				// })
				uni.navigateTo({
					url: `../dailyInspectionList?inspectMenuDate=${item.inspectMenuDate}&bol=true&inspectMenuId=${item.inspectMenuId}`
				})


			}
		}
	}
</script>

<style lang="scss" scoped>
	.inspection-history {
		.history-inspection-list {
			background: #fff;

			.ul-list-wrap {
				.li-item-wrap {
					padding: 15px 12px;
					border-bottom: 1px dashed #EAEAEA;

					.li-item-wrap-view {
						font-size: 28rpx;
						display: flex;
						align-items: center;
						justify-content: space-between;
					}


					.inspection-total-wrap {
						font-size: 30rpx;
						display: flex;

						.already-wrap {
							font-size: 28rpx;
							color: #898989;
						}

						.total-wrap {
							&:before {
								content: '/'
							}
						}
					}
				}
			}

			.loading-wrap {
				.showLoadingTag {
					text-align: center;

					& span {
						display: inline-block;
						box-sizing: border-box;
						text-align: center;
						vertical-align: middle;
						padding: .5rem;
						color: #898989;
						font-size: 1.14rem;
					}
				}

				.noMoreDataTag,
				.loadedFail {
					box-sizing: border-box;
					text-align: center;
					padding: .5rem;
					color: #898989;
					font-size: 1.14rem;
				}
			}

		}
	}
</style>
